<div>
    <div class="row">
        <div class="col-md-2 padding-r-0">
            <div class=" border-radius ">
                <div class="margin-xs-r  treeview attendance-staff">
                    <ul class="list-group text-center border-radius">
                        <!--  -->
                        <li class="list-group-item node-orgTree " v-for="(item,index) in listOwnerCarInfo.leaseTypes"
                            :key="index" @click="swatchLeaseType(item)"
                            :class="{'vc-node-selected':listOwnerCarInfo.conditions.leaseType == item.statusCd}">
                            {{item.name}}
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="col-md-10">
            <div class="row">
                <div class="col-lg-12">
                    <div class="ibox ">
                        <div class="ibox-title">
                            <h5>
                                <vc:i18n name="查询条件" namespace="listOwnerCar"></vc:i18n>
                            </h5>
                            <div class="ibox-tools" style="top:10px;">
                                <!-- <button type="button" class="btn btn-link btn-sm" style="margin-right:10px;" v-on:click="_moreCondition()">
                                    {{listOwnerCarInfo.moreCondition == true ? '隐藏' : '更多'}}
                                </button> -->
                            </div>
                        </div>
                        <div class="ibox-content">
                            <div class="row">
                                <div class="col-sm-2">
                                    <div class="form-group input-group">
                                        <input type="text" :placeholder="vc.i18n('请输入车牌号','listOwnerCar')"
                                            v-model="listOwnerCarInfo.conditions.carNumLike" class="form-control">
                                    </div>
                                </div>
                                <div class="col-sm-2">
                                    <div class="form-group">
                                        <input type="text" :placeholder="vc.i18n('请填写车位编号','listOwnerCar')"
                                            class=" form-control" v-model="listOwnerCarInfo.conditions.num">
                                    </div>
                                </div>
                                <div class="col-sm-2">
                                    <div class="form-group">
                                        <select class="custom-select" v-model="listOwnerCarInfo.conditions.valid">
                                            <option selected value="">{{vc.i18n('必填，请选择车位状态','listOwnerCar')}}</option>
                                            <option value="1">{{vc.i18n('正常','listOwnerCar')}}</option>
                                            <!-- <option value="3">{{vc.i18n('到期','listOwnerCar')}}</option> -->
                                            <option value="2">{{vc.i18n('无车位','listOwnerCar')}}</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-sm-2">
                                    <div class="form-group">
                                        <input type="text" :placeholder="vc.i18n('请填写业主名称','listOwnerCar')"
                                            class=" form-control" v-model="listOwnerCarInfo.conditions.ownerName">
                                    </div>
                                </div>
                                <div class="col-sm-2">
                                    <div class="form-group input-group">
                                        <input type="text" :placeholder="vc.i18n('请输入联系方式','listOwnerCar')"
                                            v-model="listOwnerCarInfo.conditions.link" class="form-control">
                                    </div>
                                </div>
                                <div class="col-sm-2">
                                    <button type="button" class="btn btn-primary btn-sm" v-on:click="_queryMethod()">
                                        <vc:i18n name="查询" namespace="listOwnerCar"></vc:i18n>
                                    </button>
                                    <button type="button" class="btn btn-primary btn-sm" v-on:click="_resetMethod()">
                                        <i class="fa fa-repeat"></i> 重置
                                    </button>
                                </div>
                                <div class="col-sm-2">
                                    <div class="form-group input-group">
                                        <input type="text" :placeholder="vc.i18n('请输入成员车牌号','listOwnerCar')"
                                            v-model="listOwnerCarInfo.conditions.memberCarNumLike" class="form-control">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="ibox">
                        <div class="ibox-title">
                            <h5>
                                <vc:i18n name="车辆信息" namespace="listOwnerCar"></vc:i18n>
                            </h5>
                            <div class="ibox-tools" style="top:10px;">
                                <form>
                                    <div class="form-row">
                                        <div class="col">
                                            <button type="button" class="btn btn-primary btn-sm"
                                                v-on:click="_addOwnerCar()">
                                                <vc:i18n name="添加" namespace="listOwnerCar"></vc:i18n>
                                            </button>
                                            <button type="button" class="btn btn-white btn-sm"
                                                v-on:click="_openOwnerCarImport(null,true)">车辆导入
                                            </button>
                                            <button type="button" class="btn btn-white btn-sm"
                                                v-on:click="_exportExcel()">
                                                <vc:i18n name="车辆导出" namespace="reportFeeSummary"></vc:i18n>
                                            </button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <div class="ibox-content">
                            <table class="footable table table-stripped toggle-arrow-tiny" data-page-size="15">
                                <thead>
                                    <tr>
                                        <th class="text-center">
                                            <vc:i18n name="车牌号" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th class="text-center">
                                            <vc:i18n name="成员车辆" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th class="text-center">
                                            <vc:i18n name="房屋号" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th data-hide="phone" class="text-center">
                                            <vc:i18n name="车牌类型" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th data-hide="phone" class="text-center">
                                            <vc:i18n name="车辆类型" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th data-hide="phone" class="text-center">
                                            <vc:i18n name="颜色" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th data-hide="phone" class="text-center">
                                            <vc:i18n name="业主" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th data-hide="phone" class="text-center">
                                            <vc:i18n name="车位" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th data-hide="phone" class="text-center">
                                            <vc:i18n name="有效期" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th data-hide="phone" class="text-center">
                                            <vc:i18n name="状态" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                        <th class="text-center">
                                            <vc:i18n name="操作" namespace="listOwnerCar"></vc:i18n>
                                        </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr v-for="car in listOwnerCarInfo.ownerCars"
                                        :class="{ 'table-danger' : _getCarState(car) == '到期'}">
                                        <td class="text-center">
                                            <a :href="'/#/pages/car/carDetail?memberId='+car.memberId"
                                                target="_blank">{{car.carNum}}</a>
                                        </td>
                                        <td class="text-center">
                                            <!-- <a href="javascript:void(0)" @click="_toCarMember(car)">{{car.memberCarCount
                                                || 0}}</a> -->
                                            {{car.memberCarCount
                                            || 0}}
                                        </td>
                                        <td class="text-center">
                                            <div style="width: 150px;">
                                                {{car.roomName}}
                                            </div>
                                        </td>
                                        <td class="text-center" v-if="car.leaseType == 'T'">
                                            临时车
                                        </td>
                                        <td class="text-center" v-else>
                                            {{car.leaseTypeName}}
                                        </td>
                                        <td class="text-center">
                                            {{car.carTypeName || '-'}}
                                        </td>
                                        <td class="text-center">
                                            {{car.carColor || '-'}}
                                        </td>
                                        <td class="text-center hand">
                                            <!-- <div class="">
                                                <a target="_blank" :href="'/#/pages/owner/ownerDetail?ownerId='+car.ownerId">{{car.ownerName}}({{car.link}})</a>
                                            </div> -->
                                            {{car.ownerName}}({{car.link}})
                                        </td>
                                        <td v-if="car.state == '1001'" class="text-center">
                                            {{car.paNum}}-{{car.num}}
                                        </td>
                                        <td v-else class="text-center">
                                            车位已释放
                                        </td>
                                        <td class="text-center" v-if="car.leaseType == 'H'">
                                            {{car.startTime}}</br>~{{car.endTime}}
                                        </td>
                                        <td class="text-center" v-else>
                                            -
                                        </td>
                                        <td class="text-center">
                                            {{_getCarState(car)}}
                                            <span v-if="car.iotStateName">
                                                (<a href="javascript:void(0)"
                                                    @click="_viewIotStateRemark(car)">{{car.iotStateName}}</a>)
                                            </span>
                                        </td>
                                        <td class="text-center">
                                            <div class="btn-group" v-if="car.psId != '-1' ">
                                                <button class="btn-white btn btn-xs"
                                                    v-on:click="_deleteCarParkingSpace(car)">
                                                    <vc:i18n name="释放" namespace="listOwnerCar"></vc:i18n>
                                                </button>
                                            </div>
                                            <div class="btn-group" v-else>
                                                <button class="btn-white btn btn-xs"
                                                    v-on:click="_addCarParkingSpace(car)">
                                                    <vc:i18n name="续租" namespace="listOwnerCar"></vc:i18n>
                                                </button>
                                            </div>
                                            <!-- <div class="btn-group">
                                                <button class="btn-white btn btn-xs" v-on:click="_toPayFee(car)">
                                                    <vc:i18n name="费用" namespace="listOwnerCar"></vc:i18n>
                                                </button>
                                            </div> -->
                                            <div class="btn-group" v-if="car.carTypeCd != '1003'">
                                                <button class="btn-white btn btn-xs"
                                                    v-on:click="_openEditOwnerCar(car)">
                                                    <vc:i18n name="修改" namespace="listOwnerCar"></vc:i18n>
                                                </button>
                                            </div>
                                            <div class="btn-group">
                                                <button class="btn-white btn btn-xs"
                                                    v-on:click="_openDelOwnerCarModel(car)">
                                                    <vc:i18n name="删除" namespace="listOwnerCar"></vc:i18n>
                                                </button>
                                            </div>

                                        </td>
                                    </tr>
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="13">
                                            <ul class="pagination float-right"></ul>
                                        </td>
                                    </tr>
                                </tfoot>
                            </table>
                            <!-- 分页 -->
                            <vc:create path="frame/pagination"></vc:create>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <vc:create path="car/importOwnerCar"></vc:create>
        <vc:create path="car/editCar" notifyLoadDataComponentName="listOwnerCar"></vc:create>
        <vc:create path="car/deleteOwnerCar" notifyLoadDataComponentName="listOwnerCar"></vc:create>
    </div>